<template>
  <div class="h-[21px] w-full">
    <div class="flex h-full items-center justify-between">
      <span class="text-[16px]">{{ title }}</span>
      <div class="flex w-[110px] items-center justify-between gap-[4px]">
        <span class="text-[16px]">{{ label }}</span>
        <span class="text-[16px]">{{ num }}</span>
      </div>
    </div>
    <img :src="imgUrl" alt="" srcset="" />
  </div>
</template>

<script setup lang="tsx">
defineProps({
  title: {
    type: String,
    default: '',
  },
  label: {
    type: String,
    default: '',
  },
  num: {
    type: [String, Number],
    default: '',
  },
  imgUrl: {
    type: String,
    default: '/static/screen/second-title.png',
  },
});
</script>

<style lang="scss" scoped></style>
